<template>
  <div class="hello">
    <h1>{{ msg }}</h1>
    <h1>{{ msgfather }}</h1>
    <button v-on:click="onClickme">click ~~</button>
  </div>
</template>

<script>
export default {
  data: function () {
    return {
      msg: 'Hello PHP  123!'
    }
  },
  events: {
    'onAddnew': function (items) {
      console.log(items)
    }
  },
  props: ['msgfather'],
  methods: {
      onClickme: function () {
          //console.log(this.msgfather),
          // this.$emit('child-tell', this.msg)
          this.$dispatch('child-tell', this.msg)
      }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1 {
  color: #42b983;
}
</style>
